import { edit_info } from '@/services/login';
import { PageContainer, ProForm, ProFormInstance } from '@ant-design/pro-components';
import { history, useModel } from '@umijs/max';
import { Button, Divider, Form, Input, message, Modal, Tooltip } from 'antd';
import CryptoJs from 'crypto-js';
import { useRef } from 'react';
type T = {
  name: string;
  sex: string;
  bris_data: string;
  phone: string;
  hunyin: string;
  minzu: string;
  xueli: string;
  add: string;
  address: string;
};
interface Iprops {
  seteditpassword: (show: boolean) => void;
  editpassword: boolean;
  // actionRef: React.MutableRefObject<ActionType | undefined>;
}
const ChangePassword = (props: Iprops) => {
  const { initialState } = useModel('@@initialState');
  const { seteditpassword, editpassword } = props;
  const formRef = useRef<ProFormInstance>();
  // 点击确认修改的回调
  const ChangePwd = () => {
    // 获取表单输入信息
    formRef.current?.validateFields().then(async (values) => {
      console.log(values);
      // 修改密码
      let request_body = {
        old_password: CryptoJs.MD5(values.oldpwd + 'f0c3c966').toString(),
        password: CryptoJs.MD5(values.newpwd + 'f0c3c966').toString(),
      };
      let res: any = await edit_info(request_body);
      console.log('密码修改成功', res);
      if (res.msg == 'ok') {
        message.success('密码修改成功！');
        seteditpassword(false);
        history.push('/welcome');
      } else {
        message.error(res.msg);
      }
    });
  };
  // 判断两次密码输入是否一致
  const validatePsw = ({ getFieldValue }: any) => {
    return {
      validator: (_: any, value: any) => {
        if (!value || getFieldValue('newpwd') === value) {
          return Promise.resolve();
        }
        return Promise.reject(new Error('两次输入密码不一致，请重新输入！'));
      },
    };
  };
  return (
    <Modal
      open={editpassword}
      onCancel={() => seteditpassword(false)}
      width={800}
      destroyOnClose={true}
      footer={null}
      maskClosable={false}
    >
      <PageContainer
        title="修改密码"
        breadcrumb={false}
        header={{
          extra: [
            initialState?.currentUser?.is_master == 1 ? (
              <Tooltip title="管理员禁止修改密码">
                <Button
                  key="ok"
                  style={{ padding: '0 12px' }}
                  type="primary"
                  onClick={() => ChangePwd()}
                  disabled
                >
                  确认修改
                </Button>
              </Tooltip>
            ) : (
              <Button
                key="ok"
                style={{ padding: '0 12px' }}
                type="primary"
                onClick={() => ChangePwd()}
              >
                确认修改
              </Button>
            ),
          ],
        }}
      >
        <Divider />
        <div style={{ width: '300px', margin: 'auto' }}>
          <ProForm
            formRef={formRef}
            submitter={{
              // 配置按钮的属性
              resetButtonProps: {
                style: {
                  // 隐藏重置按钮
                  display: 'none',
                },
              },
              submitButtonProps: {
                style: {
                  // 隐藏提交按钮
                  display: 'none',
                },
              },
            }}
          >
            <Form.Item
              label="原密码"
              name="oldpwd"
              validateTrigger="onBlur"
              rules={[
                {
                  required: true,
                  message: '请输入原密码',
                },
              ]}
            >
              <Input.Password
                placeholder="请输入原密码"
                name="oldpwd"
                id="oldpwd"
                disabled={initialState?.currentUser?.is_master == 1}
              />
            </Form.Item>
            <Form.Item
              label="新密码"
              validateTrigger="onBlur"
              name="newpwd"
              rules={[
                {
                  required: true,
                  message: '请输入新密码',
                },
                {
                  pattern: /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{6,16}$/,
                  message: '密码必须是6-16位的字母加数字组合',
                },
              ]}
            >
              <Input.Password
                placeholder="请输入6-16位新密码,包含数字和字母"
                id="newpwd"
                name="newpwd"
                disabled={initialState?.currentUser?.is_master == 1}
              />
            </Form.Item>
            <Form.Item
              label="确认密码"
              dependencies={['newpwd']}
              validateTrigger="onBlur"
              name="endpwd"
              rules={[
                {
                  required: true,
                  message: '请再次输入密码！',
                },
                validatePsw,
              ]}
            >
              <Input.Password
                placeholder="请再次输入密码"
                name="endpwd"
                id="endpwd"
                disabled={initialState?.currentUser?.is_master == 1}
              />
            </Form.Item>
          </ProForm>
        </div>
      </PageContainer>
    </Modal>
  );
};
export default ChangePassword;
